﻿<div class="formcontact">
    <h4 class="title title wow fadeInUp"> 留下您想要咨询的信息</h4>
    <form id="sendForm" action="/send" method="post">
        <div class="row">
            <div class="col-md">
                <div class="form-grounp">
                    <input class="form-control" type="text" id="firstName" name="firstName" placeholder="FIRST NAME">
                </div>
            </div>
            <div class="col-md">
                <div class="form-grounp">
                    <input class="form-control" type="text" id="lastName" name="lastName" placeholder="LAST NAME">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md">
                <div class="form-grounp">
                    <input class="form-control" type="text" id="email" name="email" placeholder="EMAIL">
                </div>
            </div>
            <div class="col-md">
                <div class="form-grounp">
                    <input class="form-control" type="text" id="phone" name="phone" placeholder="PHONE NUMBER">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md">
                <div class="form-grounp">
                    <input class="form-control" type="text" id="jobtitle" name="jobtitle" placeholder="JOB TITLE">
                </div>
            </div>
            <div class="col-md">
                <div class="form-grounp">
                    <input class="form-control" type="text" id="company" name="company" placeholder="COMPANY">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <div class="form-grounp">
                    <input class="form-control" type="text" id="country" name="country" placeholder="COUNTRY/REGION">
                </div>
            </div>
            <div class="col-md-12">
                <div class="form-grounp">
                    <textarea class="form-control" id="message" name="message" rows="5" placeholder="MESSAGE"></textarea>
                </div>
            </div>
        </div>
        <div class="action">
            <button class="btn btn-black" type="button" id="btnSubmit">提交</button>
        </div>
    </form>
</div>
@*<link href="~/layui/css/layui.css" rel="stylesheet" />*@
<script src="~/layui/layui.js"></script>
<script src="~/js/jquery-1.10.2.min.js"></script>
<script>
    layui.use(['layer'], function () {
        var $ = layui.$;
        layer = layui.layer;

        $("#btnSubmit").click(function () {
            var firstName = $("#firstName").val();
            if (!firstName) {
                layer.msg("FIRST NAME can not be empty！", { icon: 0, time: 1500 });
                return;
            }
            var lastName = $("#lastName").val();
            if (!lastName) {
                layer.msg("LAST NAME can not be empty！", { icon: 0, time: 1500 });
                return;
            }
            var phone = $("#phone").val();
            if (!phone) {
                layer.msg("PHONE NUMBER can not be empty！", { icon: 0, time: 1500 });
                return;
            }
            var jobtitle = $("#jobtitle").val();
            if (!jobtitle) {
                layer.msg("JOB TITLE can not be empty！", { icon: 0, time: 1500 });
                return;
            }
            var company = $("#company").val();
            if (!company) {
                layer.msg("COMPANY can not be empty！", { icon: 0, time: 1500 });
                return;
            }
            var country = $("#country").val();
            if (!country) {
                layer.msg("COUNTRY/REGION can not be empty！", { icon: 0, time: 1500 });
                return;
            }
            var message = $("#message").val();
            if (!message) {
                layer.msg("MESSAGE can not be empty！", { icon: 0, time: 1500 });
                return;
            }
            var email = $("#email").val();
            // 正则验证格式
            var reg = /^([a-zA-Z0-9_\.\-])+\@@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
            if (!reg.test(email)) {
                layer.msg("请输入有效的邮箱！", { icon: 0, time: 1500 });
                return;
            }
            $.post('/send', $("#sendForm").serialize(), function (res) {
                if (res.success) {
                    document.getElementById("sendForm").reset();
                    layer.msg("发送成功！", { icon: 1, time: 1500 });
                }
                else {
                    layer.msg("发送失败！", { icon: 1, time: 1500 });
                }
            });
        });
    });
</script>

